<template>
    <div>
        <el-card>
            <!-- 页面头部导航 -->
            <el-page-header
                content="简历评价列表"
                icon=""
                title="反馈信息"
            />

            <!-- 简历评价表格 -->
            <el-table
                :data="state.tableData"
                style="width: 100%"
            >
                <!-- 通过cv_id映射简历标题 -->
                <el-table-column width="200" label="简历标题">
                    <template #default="scope">
                        {{handleCvTitle(scope.row.cv_id)}}
                    </template>
                </el-table-column>

                <!-- 通过article_id映射信息标题 -->
                <el-table-column width="200" label="信息标题">
                    <template #default="scope">
                        {{handleArticleTitle(scope.row.article_id)}}
                    </template>
                </el-table-column>

                <!-- 显示建议内容 -->
                <el-table-column label="建议">
                    <template #default="scope">
                        {{scope.row.advice}}
                    </template>
                </el-table-column>
            </el-table>
        </el-card>
    </div>
</template>

<script setup>
// 引入Vue组合式API
import { ref, onMounted, reactive } from "vue";
// 引入HTTP请求库
import axios from "axios";
// 引入路由和状态管理
import { useRouter } from 'vue-router'
import { useStore } from 'vuex'

// 初始化状态管理
const store = useStore()
const router = useRouter()
const state = reactive({
    tableData: [],          // 表格展示数据
    CvsOfUser: [],          // 用户创建的简历列表
    resultOfArticle: [],    // 文章查询结果
    resultOfPostRecord: []  // 投递记录查询结果
})

// 生命周期钩子：挂载后加载数据
onMounted(() => {
  getTableData();
});

// 获取表格数据的核心函数
const getTableData = async () => {
    // 初始化数据
    state.tableData = [];
    
    // 1. 根据用户ID获取其所有简历
    const Cvs = await axios.get(`/cv/findByAuthor?author=${store.state.userInfo.id}`);
    state.CvsOfUser = Cvs.data.data;
    
    // 2. 提取简历ID数组
    const cvids = state.CvsOfUser.map(item => item.id);
    
    // 3. 根据简历ID查询投递记录
    const res = await axios.post("/postRecord/findByCv_ids", cvids);
    const articleIds = res.data.data.map(item => item.article_id);
    
    // 4. 根据文章ID查询文章信息
    const result = await axios.post("/article/findByIds", articleIds);
    state.resultOfArticle = result.data.data;
    state.resultOfPostRecord = res.data.data;
    
    // 5. 最终表格数据为投递记录
    state.tableData = state.resultOfPostRecord;
};

// 根据cv_id查找简历标题
const handleCvTitle = (cv_id) => {
    return state.CvsOfUser.find(item => item.id === cv_id)?.title;
};

// 根据article_id查找文章标题
const handleArticleTitle = (article_id) => {
    return state.resultOfArticle.find(item => item.id === article_id)?.title;
};

</script>

<style lang="scss" scoped>
.el-table {
  margin-top: 50px; // 表格顶部间距
}
</style>